{include file="common/head"/}
<style>
    .layui-table-cell{height: auto;}
    .layui-table-cell ul li a{color: #1C8FEF;display: block;border: 1px solid #ececec;padding: 3px 8px;}
    .layui-table-cell ul li a:hover{color: #f2f2f2
    }
</style>
<div class="admin-main layui-anim layui-anim-upbit" style="margin-top: 0px;margin-bottom: 0px">
    <div style="width:20% ;margin-top: 20px;float:left;background-color: gray;overflow-y:auto;height:567px;">
        <ul class="layui-nav layui-nav-tree layui-inline ul" lay-filter="demo" style="width:268px ;">

            {if condition="$timus != ''"}
            {volist name="timus" id="vo" key='k'}
            <li class="layui-nav-item layui-nav-itemed nav-meeting" style=" width:245px;white-space:nowrap;text-overflow:ellipsis;-o-text-overflow:ellipsis;overflow: hidden;padding-left: 20px" ee="edit" tti="{$vo.title}" tmid="{$vo.cate_id}"  id="tm{$vo.cate_id}">{$k}.{$vo.title}</li>
            {/volist}
            {/if}

        </ul>
    </div>
    <div style="margin-left: 20px;float:left;width: 77%">
        <table class="layui-table" id="list" lay-filter="list"></table>
    </div>
    <div style="clear: both"></div>
    <div class="layui-btn-group demoTable" style="    position: absolute;right: 67px;bottom: 10px">
        <button class="layui-btn" data-type="getCheckData"  style="margin-right: 20px">{:lang('submit')}</button>
    </div>
    <input type="hidden" id="cate_id" name="cate_id" value="{$cate_id}">


</div>

<script type="text/html" id="status">
    <input type="checkbox" name="is_open" value="{{d.id}}" lay-skin="switch" lay-text="开启|关闭" lay-filter="status" {{ d.status == 1 ? 'checked' : '' }}>
</script>
{include file="common/foot"/}
<script>
    layui.use('table', function() {
        var table = layui.table, $ = layui.jquery;var form = layui.form;

        //记录选中的数据:做缓存使用,作为参数传递给后台,然后生成pdf ,压缩
        var ids = new Array();

        //编辑时给ids赋初值
        var timus= $('li[ee="edit"]');

        for (var i = 0; i < timus.length; i++) {

            ids.push(parseInt(timus.eq(i).attr('tmid')));
        }

        //当前表格中的全部数据:在表格的checkbox全选的时候没有得到数据, 因此用全局存放变量
        var table_data=new Array();

        //渲染表格
        var tableIn = table.render({
            id: 'user',
            elem: '#list',
            url: "{:url('cate_list')}",
            method: 'post',
            page: { //分页设定
                layout: ['count', 'prev', 'page', 'next'] //自定义分页布局
                , curr: 1 //设定初始在第 1 页
                , limit: 10//每页多少数据
                , groups: 5 //只显示 5 个连续页码
            },
            even:true,
            cols: [[
                {type:'checkbox', event: 'setSign'},
                {field: 'title', title: '考核项分类名称', width: 500,templet:'#name'},
            ]],
            done: function(res, curr, count){
                //数据表格加载完成时调用此函数
                //如果是异步请求数据方式，res即为你接口返回的信息。
                //如果是直接赋值的方式，res即为：{data: [], count: 99} data为当前页数据、count为数据总长度

                //设置全部数据到全局变量
                table_data=res.data;

                //在缓存中找到id ,然后设置data表格中的选中状态
                //循环所有数据，找出对应关系，设置checkbox选中状态
                for(var i=0;i< res.data.length;i++){
                    for (var j = 0; j < ids.length; j++) {

                        //数据id和要勾选的id相同时checkbox选中
                        if(res.data[i].cate_id == ids[j])
                        {
                            //这里才是真正的有效勾选
                            res.data[i]["LAY_CHECKED"]='true';
                            //找到对应数据改变勾选样式，呈现出选中效果
                            var index= res.data[i]['LAY_TABLE_INDEX'];

                            $('.layui-table tr[data-index=' + index + '] input[type="checkbox"]').prop('checked', true);
                            $('.layui-table tr[data-index=' + index + '] input[type="checkbox"]').next().addClass('layui-form-checked');
                        }
                    }
                }
                //设置全选checkbox的选中状态，只有改变LAY_CHECKED的值， table.checkStatus才能抓取到选中的状态
                var checkStatus = table.checkStatus('my-table');
                if(checkStatus.isAll){
                    $(' .layui-table th[data-field="0"] input[type="checkbox"]').prop('checked', true);
                    $('.layui-table th[data-field="0"] input[type="checkbox"]').next().addClass('layui-form-checked');
                }
                //得到所有数据
                console.log(res);
                //得到当前页码
                console.log(curr);
                //得到数据总量
                console.log(count);
            }
        });

        //监听表格复选框选择
        table.on('checkbox(list)', function(obj){


            if(obj.checked==true){

                if(obj.type=='one'){

                    if($.inArray(obj.data.cate_id,ids)==-1){
                        ids.push(obj.data.cate_id);
                        var m = $(".nav-meeting").length+1;
                        item = "<li class=\"layui-nav-item layui-nav-itemed nav-meeting\" style=\" width:245px;white-space:nowrap;text-overflow:ellipsis;-o-text-overflow:ellipsis;overflow: hidden;padding-left: 20px\" tti=\""+obj.data.title+"\" tmid=\""+obj.data.cate_id+"\"  id=\"tm"+obj.data.cate_id+"\">"+m+"."+obj.data.title+"</li>";
                        $(".ul").append(item);
                    }


                }else{

                    for(var i=0;i<table_data.length;i++){
                        if($.inArray(table_data[i].cate_id,ids)==-1){
                            ids.push(table_data[i].cate_id);
                            var m = $(".nav-meeting").length+1;
                            item = "<li class=\"layui-nav-item layui-nav-itemed nav-meeting\" style=\" width:245px;white-space:nowrap;text-overflow:ellipsis;-o-text-overflow:ellipsis;overflow: hidden;padding-left: 20px\" tti=\""+table_data[i]['title']+"\" tmid=\""+table_data[i]['cate_id']+"\"  id=\"tm"+table_data[i]['cate_id']+"\">"+m+"."+table_data[i]['title']+"</li>";
                            $(".ul").append(item);
                        }
                    }

                }

            }else{

                if(obj.type=='one'){

                    for(var i=0;i<ids.length;i++){
                        if(ids[i]==obj.data.cate_id){
                            ids.remove(i);
                            $("#tm"+obj.data.cate_id).remove();
                        }
                    }
                }else{
                    for(var j=0;j<table_data.length;j++){
                        for(var i=0;i<ids.length;i++){

                            if(ids[i]==table_data[j].cate_id){
                                ids.remove(i);
                                $("#tm"+table_data[j].cate_id).remove();
                            }
                        }
                    }
                }

            }

        });

        // 提交
        $('.demoTable .layui-btn').on('click', function(){
            if(ids.length==0){
                layer.msg('请选择题目分类',{time:1000,icon:2});
                return;
            }
            $.post("{:url('groupAssess')}",{performance_cate_ids:ids,position_id:$("#cate_id").val()},function(res){
                if(res.code > 0){
                    layer.msg(res.msg,{time:1000,icon:1},function(){
                        parent.location.href = res.url;
                    });
                }else{
                    layer.msg(res.msg,{time:1000,icon:2});
                }
            });
        });
    });

    //删除数组自定义函数
    Array.prototype.remove=function(dx)
    {
        if(isNaN(dx)||dx>this.length){return false;}
        for(var i=0,n=0;i<this.length;i++)
        {
            if(this[i]!=this[dx])
            {
                this[n++]=this[i]
            }
        }
        this.length-=1
    }
</script>
</body>
</html>